<div class="py-md">

  <nz-card [nzBordered]="false" class="card-top">
    <div nz-row nzType="flex" nzJustify="space-between" nzAlign="middle" [nzGutter]="{md: 12, lg: 16, xl: 24, xxl: 32}">

      <div nz-col>
        <nz-form-item nz-row nzFlex class="mb0">
          <nz-form-label>查询</nz-form-label>
          <nz-form-control>
            <input nz-input [(ngModel)]="params.keywords" (ngModelChange)="debounceLoad()" placeholder="输入公司名称、别名或其它信息" class="width-lg">
          </nz-form-control>
        </nz-form-item>
      </div>

      <div nz-col>
        <button nz-button nzType="primary" (click)="createCompany()">
          <i class="anticon anticon-plus"></i>
          <span>创建公司</span>
        </button>
        <nz-dropdown nzPlacement="bottomRight" class="ml-sm">
          <button nz-button nz-dropdown>
            <i class="anticon anticon-ellipsis"></i>
          </button>
          <ul nz-menu>
            <!-- <li nz-menu-item (click)="load()">刷新列表</li> -->
            <!-- <li nz-menu-item>批量删除</li> -->
          </ul>
        </nz-dropdown>
      </div>

    </div>
  </nz-card>

  <nz-card [nzBordered]="false">
    <nz-table #companiesTable [nzData]="data.companies" [nzFrontPagination]="false" [nzTotal]="data.companyTotal" [(nzPageIndex)]="params.pageIndex"
      [(nzPageSize)]="params.pageSize" [nzShowTotal]="showTotal" [nzLoading]="config.loading" nzShowQuickJumper nzShowSizeChanger (nzPageIndexChange)="load()"
      (nzPageSizeChange)="load()">
      <thead>
        <tr>
          <th>公司名称</th>
          <th>公司代码</th>
          <th>公司类型</th>
          <th>别名</th>
          <th>最后更新人</th>
          <th nzShowSort [(nzSort)]="params.lastModifiedTimeSort" (nzSortChange)="load()">最后更新时间</th>
          <th>操作</th>
        </tr>
      </thead>
      <tbody>
        <tr *ngFor="let data of companiesTable.data">
          <td>{{data.companyNameChs}}</td>
          <td>{{data.companyCode}}</td>
          <td>{{data.companyType}}</td>
          <td>{{data.alias}}</td>
          <td>{{data.lastModifiedBy}}</td>
          <td>{{data.lastModifiedTime | date:'yyyy-MM-dd hh:mm:ss'}}</td>
          <td>
            <a (click)="updateCompany(data)">修改</a>
            <nz-divider nzType="vertical"></nz-divider>
            <nz-popconfirm nzTitle="您确定要删除该公司吗？" nzPlacement="topRight" (nzOnConfirm)="deleteCompany(data)">
              <a nz-popconfirm>删除</a>
            </nz-popconfirm>
          </td>
        </tr>
      </tbody>
      <ng-template #showTotal let-implicit let-range>
        <div>共 {{ implicit }} 条记录</div>
      </ng-template>
    </nz-table>
  </nz-card>

</div>